<template lang="html">
  <div class="main-page" id="store-page">
    <!-- 标题 -->
    <!-- <van-nav-bar class="main-header" title="成为美家美货会员" :left-arrow="true" :fixed="true" :z-index="11" @click-left="onClickLeft"/> -->
    <nav-bar :title="'邀请好友注册'"  @goBack="onClickLeft"/>
    <!-- 主体内容 -->
      <div class="main-content has-header-space">
        <div class="become_vip_page">
          <div :class="isClient ? 'vip_number' : 'vip_number m_top'" @click="goMyfans">
            <span>您已成功邀请{{vip_total}}位好友注册开通VIP</span>
            <div class='more'>查看更多 <span>></span></div>
          </div>
          <div class="vip_banner">
            <img class="vip_banner_img" src="https://mjmh.meijiameihuo.com/wechat/images/v2/become_vip_bg.png" />
          </div>
          <div class="tab">
            <van-tabs v-model="active" title-active-color="#E91F3F" title-inactive-color="#333333" sticky :offset-top="offset_top">
              <van-tab title="全部礼包">
                <div class="tab_conent">
                  <Gifpack></Gifpack>
                </div>
              </van-tab>
              <van-tab title="邀请攻略">
                <div class="tab_conent">
                  <div class="strategy">
                    <img src="https://mjmh.meijiameihuo.com/wechat/images/v2/step_bg.png" />
                  </div>
                </div>
              </van-tab>
            </van-tabs>
          </div>
          <div class="vip_fiex_h">
              <div class="invite_btn" @click="Share">快速领取返利</div>
          </div>
        </div>
      </div>
  </div>
</template>

<script>
import Gifpack from '@/components/active/becomevip/gifpack.vue'
import NavBar from '@/components/global/nav-bar.vue'
// import Path from '@/utils/path.js'
import Tool from '@/utils/tool.js'
import Domain from '@/utils/domain.js'

export default {
  components: { Gifpack, NavBar },
  data () {
    return {
      active: '0',
      ad_list: {},
      offset_top: 0,
      user_info: {},
      isClient: false,
      vip_total: 0
    }
  },
  created () {
    // this.getDetalis(this.$route.params.id)
    this.getProfile()
    let isClient = Tool.isClient()
    this.isClient = isClient
    this.getTeamNum()
  },
  mounted () {
    // window.addEventListener('scroll',this.handleScroll,true)
  },
  beforeUpdate () {
    let dom = document.getElementsByClassName('main-header')
    if (dom && dom[0]) {
      let dh = dom[0].clientHeight || dom[0].offsetHeight
      this.offset_top = dh
    }
  },

  methods: {
    handleScroll () {
      sessionStorage.setItem('vip_h', window.pageYOffset)
      console.log(window.pageYOffset)
    },
    onClickLeft () {
      this.$router.go(-1)
    },
    switchTab (e) {
      console.log(e.target.dataset.i)
      this.active = e.target.dataset.i
    },
    goMyfans () {
      this.$router.push('/merber/team?type=vip')
    },
    getProfile () {
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'profile', method: 'get' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.user_info = resp.data.user_info
          }
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    },
    getTeamNum () {
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'user_team', params: { type: 'vip' }, method: 'get' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.vip_total = resp.data.total
          }
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    },
    Share () {
      var url = 'pages/activity/join_vip/join_vip?invite=' + this.user_info.invite_id
      var title = '倾情推荐！开启超级会员之旅，超值特权嗨不停。'
      var desc = 'Hi，我是' + this.user_info.user_nickname + '分享一个正品购物平台给你'
      var imgurl = encodeURIComponent(Domain('/wechat/images/v4/share_vip.png'))
      window.location = 'yggshare://title=' + title + '&desc=' + desc + '&imgurl=' + imgurl + '&url=' + url
    }
  }
}
</script>
